<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="description" content="">
		<title>新建待办事项</title>
		<link href="http://g.alicdn.com/sj/dpl/1.5.1/css/sui.min.css" rel="stylesheet">
		<script type="text/javascript" src="http://g.alicdn.com/sj/lib/jquery/dist/jquery.min.js"></script>
		<script type="text/javascript" src="http://g.alicdn.com/sj/dpl/1.5.1/js/sui.min.js"></script>
	</head>

	<body>
		<div class="sui-container">
			<ul class="sui-breadcrumb">
				<li><a href="#">待办事项</a></li>
				<li class="active">添加待办事项</li>
			</ul>
			<div class="sui-msg msg-large msg-block msg-success">
				<div class="msg-con">
					新的待办事项"DEMO"创建成功！
				</div>
				<s class="msg-icon"></s>
			</div>
			<form class="sui-form form-horizontal sui-validate" action="" method="post" id="servingForm">
				<div class="control-group">
					<label class="control-label">名称：</label>
					<div class="controls">
						<input class="input-xlarge" type='text' data-rules="required|minlength=2|maxlength=50" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">时间：</label>
					<div class="controls">
						<select class="input-medium " name='month' data-rules='required'>
							<option value="1">1</option>
							<option value="2">2</option>
							<option value="3">3</option>
							<option value="4">4</option>
							<option value="5">5</option>
							<option value="6">6</option>
							<option value="7">8</option>
							<option value="8">9</option>
							<option value="9">9</option>
							<option value="10">10</option>
							<option value="11">11</option>
							<option value="12">12</option>
						</select>
						月
						<select class="input-medium " name='date' data-rules='required'>
							<option value="1">1</option>
							<option value="2">2</option>
							<option value="3">3</option>
							<option value="4">4</option>
							<option value="5">5</option>
							<option value="6">6</option>
							<option value="7">8</option>
							<option value="8">9</option>
							<option value="9">9</option>
							<option value="10">10</option>
							<option value="11">11</option>
							<option value="12">12</option>
						</select>
						日
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">补充说明：</label>
					<div class="controls">
						<textarea class='input-xlarge' data-rules='maxlength=100'></textarea>
					</div>
				</div>
				<div class="control-group">
					<div class="controls">
						<button class="sui-btn btn-primary btn-xlarge">创建待办事项</button>
					</div>
				</div>
			</form>
		</div>
		<hr />
		<a href="javascript:void(0);" class="sui-btn btn-xlarge">默认</a>
		<a href="javascript:void(0);" class="sui-btn btn-xlarge btn-primary">首要</a>
		<a href="javascript:void(0);" class="sui-btn btn-xlarge btn-success">成功</a>
		<a href="javascript:void(0);" class="sui-btn btn-xlarge btn-info">信息</a>
		<a href="javascript:void(0);" class="sui-btn btn-xlarge btn-warning">警告</a>
		<a href="javascript:void(0);" class="sui-btn btn-xlarge btn-danger">危险</a>
		<a href="javascript:void(0);" class="sui-btn btn-xlarge btn-link">链接</a>
		<br>
		<br><a href="javascript:void(0);" class="sui-btn btn-large">默认</a>
		<a href="javascript:void(0);" class="sui-btn btn-large btn-primary">首要</a>
		<a href="javascript:void(0);" class="sui-btn btn-large btn-success">成功</a>
		<a href="javascript:void(0);" class="sui-btn btn-large btn-info">信息</a>
		<a href="javascript:void(0);" class="sui-btn btn-large btn-warning">警告</a>
		<a href="javascript:void(0);" class="sui-btn btn-large btn-danger">危险</a>
		<a href="javascript:void(0);" class="sui-btn btn-large btn-link">链接</a>
		<br>
		<br><a href="javascript:void(0);" class="sui-btn">默认</a>
		<a href="javascript:void(0);" class="sui-btn btn-primary">首要</a>
		<a href="javascript:void(0);" class="sui-btn btn-success">成功</a>
		<a href="javascript:void(0);" class="sui-btn btn-info">信息</a>
		<a href="javascript:void(0);" class="sui-btn btn-warning">警告</a>
		<a href="javascript:void(0);" class="sui-btn btn-danger">危险</a>
		<a href="javascript:void(0);" class="sui-btn btn-link">链接</a>
		<br>
		<br><a href="javascript:void(0);" class="sui-btn btn-small">默认</a>
		<a href="javascript:void(0);" class="sui-btn btn-small btn-primary">首要</a>
		<a href="javascript:void(0);" class="sui-btn btn-small btn-success">成功</a>
		<a href="javascript:void(0);" class="sui-btn btn-small btn-info">信息</a>
		<a href="javascript:void(0);" class="sui-btn btn-small btn-warning">警告</a>
		<a href="javascript:void(0);" class="sui-btn btn-small btn-danger">危险</a>
		<a href="javascript:void(0);" class="sui-btn btn-small btn-link">链接</a>
		<br>
		<br><a href="javascript:void(0);" class="sui-btn disabled">默认禁用</a> &nbsp;<a href="javascript:void(0);" class="sui-btn disabled btn-primary">首要禁用</a> &nbsp;<a href="javascript:void(0);" class="sui-btn disabled btn-success">成功禁用</a> &nbsp;<a href="javascript:void(0);"
		class="sui-btn disabled btn-info">信息禁用</a> &nbsp;<a href="javascript:void(0);" class="sui-btn disabled btn-warning">警告禁用</a> &nbsp;<a href="javascript:void(0);" class="sui-btn disabled btn-danger">危险禁用</a> &nbsp;<a href="javascript:void(0);" class="sui-btn disabled btn-link">链接禁用</a>		&nbsp;
	</body>

</html>